<template>
	<view>
		<TicketNavbarSwiper ref="navbarSwiper" :navbarList="navbarList" :curNavbar="curNavbar" :delayDay="delayDay" :height="'88rpx'" :dateList="dateList"
		 @handleChooseNavbar="handleChooseNavbar" @handleScrolltolower="handleScrolltolower" @handleRefresherrefresh="handleRefresherrefresh">
		</TicketNavbarSwiper>

		<CommonShowCode ref="showCode" :url="dateInfo.qrCode" @hide="getList"></CommonShowCode>
		<CommonTip :hideBtn="false" ref="tip" :config="tipConfig" @confirm="handleContactCustomerService"></CommonTip>
		<!-- <CommonBackReasonSubmit ref="submitReason" @confirm="handleSubmitBackReason"></CommonBackReasonSubmit> -->
		<CommonBackReasonSubmitMoney :price="cancleOrderShouldPayMoney" ref="submitReason" @confirm="handleSubmitBackReason"></CommonBackReasonSubmitMoney>
	</view>
</template>

<script>
	import CommonBackReasonSubmit from '@/components/common/common-backReason-submit.vue'
	import CommonBackReasonSubmitMoney from '@/components/common/common-backReason-submit-money.vue'
	import CommonShowCode from '@/components/common/common-showCode.vue'
	import TicketNavbarSwiper from '@/components/user/ticket-navbarSwiper.vue'
	import CommonTip from '@/components/common/common-tip.vue'
	export default {
		components: {
			TicketNavbarSwiper,
			CommonShowCode,
			CommonTip,
			CommonBackReasonSubmitMoney,
			CommonBackReasonSubmit
		},
		data() {
			return {
				navbarList: [{
						name: '未出行',
						alias: 'noTravel'
					},
					{
						name: '已出行',
						alias: 'traveled'
					},
					{
						name: '已退票',
						alias: 'refunded'
					},
				],
				curIndex: 0,
				curNavbar: {
					name: '未出行',
					alias: 'noTravel'
				},
				noTravelList: [],
				traveledList: [],
				refundedList: [],
				page: {
					pageNum: 1,
					totalPageNum: 0,
					pageSize: 10,
				},
				dateInfo: {},
				tipConfig: {
					content: '退票、改签服务请直接联系客服办理',
					btnText: '联系客服',
					icon: '@/pagesUser/static/phone-icon.png',
					tit: '温馨提示'
				},
				cancleOrderShouldPayMoney: 0,
				delayDay: 0, // 默认可以选择几天后的日期
			};
		},
		onLoad() {
			this.getList()
			uni.$on('showCode', (data) => { // 展示二维码
				this.dateInfo = data
				this.$refs.showCode.show()
			})
			uni.$on('Refund', (data) => { // 退票
				this.dateInfo = data
				this.getBusRefundRate()
				setTimeout(() => {
				this.$refs.submitReason.show()
				},20)
			})
			uni.$on('delPiao', (data) => { // 删除车票
				this.dateInfo = data
				this.delTicket()
				// setTimeout(() => {
				// this.$refs.submitReason.show()
				// },20)
			})
			uni.$on('Change', (data) => { // 改签
				this.dateInfo = data
				this.$refs.tip.show()
			})
			// this.getDelayDays()
		},
		onUnload() {
			uni.$off('showCode')
			uni.$off('Refund')
			uni.$off('delPiao')
			uni.$off('Change')
		},
		computed: {
			dateList() {
				return [this.noTravelList, this.traveledList, this.refundedList]
			}
		},
		methods: {
			handleSubmitBackReason(reason) {
				const _this = this
				uni.requestSubscribeMessage({
					tmplIds: ['58yzFNiV-am9kUCIMJjJV1DVDbS_M27xeXkhG6Q_ruc'],
					success(res) {
						 _this.submitWxNotifyConfirm('58yzFNiV-am9kUCIMJjJV1DVDbS_M27xeXkhG6Q_ruc',res['58yzFNiV-am9kUCIMJjJV1DVDbS_M27xeXkhG6Q_ruc'])
						_this.$http.get(_this.$api.busRefundRate, {
							ticketId: _this.dateInfo.id,
						}).then(res => {
							_this.$http.get(_this.$api.RefundTicket, {
								ticketId: _this.dateInfo.id,
								reason
							}).then(res => {
								if (res.code === 200) {
									uni.showToast({
										title: '退票成功',
										icon: 'none'
									})
									_this.getList()
								}
							})
						})
					}
				})
			},
			// 获取退票扣费
			getBusRefundRate(){
				this.$http.get(this.$api.busRefundRate, {
					ticketId: this.dateInfo.id,
				}).then(res => {
					this.cancleOrderShouldPayMoney = res.data.fee
				})
			},
			//删除车票
			delTicket(){
				this.$http.get(this.$api.deleteOrder, {
					noOrId: this.dateInfo.id,
					type: 2
				}).then(res => {
					this.page.pageNum = 1
					this.getList()
				})
			},
			handleContactCustomerService() { // 联系客服
				console.log('联系客服');
			},
			handleChooseNavbar(item, i) {
				this.curNavbar = item
				this.curIndex = i
				this.getList()
			},
			// 滚动到底部
			handleScrolltolower(item, i) {
				let totalPage = Math.ceil(this.page.totalPageNum / this.page.pageSize)
				console.log(totalPage);
				if (this.page.pageNum >= totalPage) return
				this.page.pageNum++
				this.getList()
			},
			 // 下拉刷新
			handleRefresherrefresh(item, i) {
				this.page.pageNum = 1
				this.getList()
			},
			// // 获取预售天数
			// getDelayDays() {
			// 	this.$http.get(this.$api.travelDelayDays).then(res => {
			// 		if (res.code === 200) {
			// 			this.delayDay = res.data.daba
			// 		}
			// 	})
			// },
			getList() {
				// this.page.pageNum = 1
				this.$http.get(this.$api.mineTicketList, {
					status: this.curIndex,
					pageNum: this.page.pageNum,
					pageSize: this.page.pageSize
				}).then(res => {
					if (res.code === 200) {
						this.page.totalPageNum = res.data.total
						this.$refs.navbarSwiper.stopPullDownRefresh()
						if (this.curIndex == 0) {
							this.noTravelList = this.page.pageNum > 1 ? [...this.noTravelList, ...res.data.result] : res.data.result
						} else if (this.curIndex == 1) {
							this.traveledList = this.page.pageNum > 1 ? [...this.traveledList, ...res.data.result] : res.data.result
						} else if (this.curIndex == 2) {
							this.refundedList = this.page.pageNum > 1 ? [...this.refundedList, ...res.data.result] : res.data.result
						}
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>

</style>
